<script setup lang="ts">
// 走马灯
import Carousel from '@/components/Carousel/Carousel.vue'
import FlexRight from '@/components/Echart/flexGlobal/flexRight.vue'
// 新老会员业绩占比
import NewOldPie from '@/components/PermissionsModule/Performance/components/NewOldPie.vue'
// 零售业绩与拓展业绩占比
import RetailPie from '@/components/PermissionsModule/Performance/components/RetailPie.vue'
// 全区业绩趋势
import globalPerformanceLine from '@/components/PermissionsModule/Performance/components/globalPerformanceLine.vue'
// 各国家业绩同比
import countryYoY from '@/components/PermissionsModule/Performance/components/countryYoY.vue'
// 各国家业绩环比
import countryRatio from '@/components/PermissionsModule/Performance/components/countryRatio.vue'
</script>

<template>
  <FlexRight></FlexRight>
  <Carousel class="carousel" :interval="5000">
    <globalPerformanceLine />
  </Carousel>
  <Carousel class="carousel" :interval="5000">
    <countryYoY />
    <countryRatio />
  </Carousel>
  <Carousel class="carousel" :interval="5000">
    <NewOldPie />
    <RetailPie />
  </Carousel>
</template>
<style lang="scss" scoped>
.carousel {
  width: 100%;

  :deep(.el-carousel__container) {
    height: 260px;
  }
}
</style>
